<template>
  <div>
    <el-container style="height: 700px;">
      <el-header>
        <div>
          <span class="header" style="">小区物业管理系统 &nbsp;|&nbsp;工作人员</span>
          <span class="header_user">
            <el-dropdown @command="handleCommand">
              <i class="el-icon-setting" style="margin-right: 15px"></i>
              <el-dropdown-menu slot="dropdown">
                <!-- <el-dropdown-item command="/index_owner/owner_message">查看</el-dropdown-item> -->
                <el-dropdown-item  command="/forgetpw">修改密码</el-dropdown-item>
                <el-dropdown-item divided command="/">退出</el-dropdown-item>

              </el-dropdown-menu>
            </el-dropdown>
            <span>{{userName}},您好</span>
          </span>
        </div>
      </el-header>

      <el-container>
        <el-aside width="200px">
          <el-menu :default-openeds="['1','2']" router>
            <!-- el-subment 扩展栏 -->
            <el-submenu index="1">
              <!-- temolate 相当于div一个模板 -->
              <template slot="title">
                <i class="el-icon-menu"></i>物业通知
              </template>
              <!-- el-meun-item 菜单的子节点 -->
              <el-menu-item index="/index_worker/showmsg">查看物业通知</el-menu-item>
            </el-submenu>
            <el-submenu index="2">
              <template slot="title">
                <i class="el-icon-menu"></i>工作管理
              </template>
              <!--index在el-menu有router的条件下变成路由-->
              <el-menu-item index="/index_worker/projecthead">工作安排</el-menu-item>
              <!-- <el-menu-item index="/index_owner/watercost">工作回复</el-menu-item> -->
            </el-submenu>
          </el-menu>
        </el-aside>
        <el-main>
          <router-view></router-view>
        </el-main>
      </el-container>
    </el-container>
  </div>
</template>




<script>
export default {
  data() {
    return {
      userName: "",
      userId:''
    };
  },
  methods: {
    handleCommand(command) {
      this.$router.push(command);
    }
  },

  created() {

     this.userId = sessionStorage.getItem("userId");

    //根据sessionstorage中的业主ID找到业主姓名
    this.axios
    //url：api/user/findusername?userid=this.userid
      .post("user/worker?userId="+this.userId)
      .then(res => {
        this.userName=res.data;
        sessionStorage.setItem("userName",res.data)
        console.log(res);
      })
      .catch(err => {
        console.error(err);
      });
//找到工作人员星级
      this.axios.post("user/workerstar?userId="+this.userId)
      .then(res => {
        sessionStorage.setItem("star",res.data)
        console.log(res)
      })
      .catch(err => {
        console.error(err); 
      })

   
  },

  components: {}
};
</script>

<style scope>
.header_user {
  position: relative;
  right: -39%;
}
.header {
  font-size: 20px;
  position: relative;
  left: -38%;
}

.el-header {
  background-color: #eceff1;
  color: #333;
  text-align: center;
  line-height: 60px;
}

.el-aside {
  background-color: #e1e6eb;
  color: #333;
  text-align: center;
  /* 修改文字大小 */
  line-height: 200px;
}

/* .el-main {
  background-color: #ffffff;
  color: #333;
  text-align: center;
  line-height: 600px;
} */

/* body > .el-container {
  margin-bottom: 40px;
}

.el-container:nth-child(5) .el-aside,
.el-container:nth-child(6) .el-aside {
  line-height: 260px;
}

.el-container:nth-child(7) .el-aside {
  line-height: 320px;
} */
</style>
